
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>注册</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="https://lib.sinaapp.com/js/bootstrap/4.2.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
    <link rel="stylesheet" href="css/style.default.css" id="theme-stylesheet">
</head>
<body>
<div class="page login-page">
    <div class="container d-flex align-items-center">
        <div class="form-holder has-shadow">
            <div class="row">
                <!-- Logo & Information Panel-->
                <div class="col-lg-6">
                    <div class="info d-flex align-items-center">
                        <div class="content">
                            <div class="logo">
                                <h1>欢迎注册</h1>
                            </div>
                            <p>Let's chat</p>
                        </div>
                    </div>
                </div>
                <!-- Form Panel    -->
                <div class="col-lg-6 bg-white">
                    <div class="form d-flex align-items-center">
                        <div class="content">
                            <div class="form-group" id="email_div">
                                <label for="email">邮箱</label>
                                <input id="email" class="input-material" type="text" name="registerUsername" placeholder="请输入你的邮箱"/>
                            </div>
                            <div class="form-group" id="code_div">
                                <label for="code">验证码</label>
                                <input id="code" class="input-material" type="text" name="registerUsername" placeholder="请输入验证码"/>
                            </div>
                            <div class="form-group" id="password_div">
                                <label for="password">输入密码</label>
                                <input id="password" class="input-material" type="text" name="registerUsername" placeholder="(随便设置就好啦，请勿认真！)"/>
                            </div>
                            <div class="form-group" id="get_code_button">
                                <button id="get_code" name="registerSubmit" class="btn btn-primary">获取验证码</button>
                            </div>
                            <div class="form-group" id="commit_code_button">
                                <button id="commit" name="registerSubmit" class="btn btn-primary">提交验证码</button>
                            </div>
                            <div class="form-group" id="re_get_button">
                                <button id="re_get_code" name="registerSubmit" class="btn btn-primary">重新获取验证码</button>
                            </div>
                            <small>已有账号?</small><a href="login.html" class="signup">&nbsp;登录</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- JavaScript files-->
<script src="https://s1.pstatp.com/cdn/expire-1-M/jquery/1.10.2/jquery.min.js"></script>
<script src="https://lib.sinaapp.com/js/bootstrap/4.2.1/js/bootstrap.min.js"></script>
</body>
</html>


<script src="js/jquery-3.6.0.js" type="text/javascript"></script>
<script>
    /////////////获取验证码

    let email_div = document.getElementById('email_div');
    let code_div = document.getElementById('code_div');
    let password_div = document.getElementById('password_div');
    let get_code_button = document.getElementById('get_code_button');
    let commit_code_button = document.getElementById('commit_code_button');
    let re_get_button = document.getElementById('re_get_button');

    code_div.style.display = 'none';
    password_div.style.display = 'none';
    commit_code_button.style.display = 'none';
    re_get_button.style.display = 'none';
    let EMAIL = ""


    get_code=function (){
        let email = $('#email').val();
        if (!/\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/.test(email)) {
            alert('邮箱不合法，请输入正确的邮箱号');
            return;
        }
        let data = {};
        data.email = email;
        data.action = "register_get_code";
        $.post("./CodeServe",data,function(json) {
            console.log(json);
            json = JSON.parse(json);
            EMAIL = email;
            if(json.result === 1 || json.result === "1"){
                alert("验证码已发送到您的邮箱！");
                email_div.style.display = 'none';
                get_code_button.style.display = 'none';
                code_div.style.display = 'block';
                password_div.style.display = 'block';
                commit_code_button.style.display = 'block';
                re_get_button.style.display = 'block';
            }
            else {
                alert(json.reason);
            }
        })
    };

    /////////提交验证码
    commit_code=function (){
        if(EMAIL==="")
            return;
        let password = $('#password').val();
        let code = $('#code').val();
        if (password==="" || code ===""){
            alert("验证码/密码 不能为空！")
            return;
        }
        let data = {};
        data.email = EMAIL;
        data.password = password;
        data.code = code;
        let myDate = new Date();
        data.register_time = myDate.toLocaleString();
        data.action = "register_commit_code";
        $.post("./CodeServe",data,function(json) {
            console.log(json);
            json = JSON.parse(json);
            if(json.result === 1 || json.result === "1"){
                alert("注册成功！");
                window.location.href="login.html";
            }
            else {
                alert(json.reason);
            }
        })
    }

    document.getElementById('get_code').addEventListener('click',get_code);
    document.getElementById('commit').addEventListener('click',commit_code);
    document.getElementById('re_get_code').addEventListener('click',get_code);
</script>